import { createStyles } from "../../utils";
import * as vars from "../../theme";

const styles = {
  root: {
    // width: 100,
    // height: 100,
    // borderStyle: "solid",
    // borderWidth: 1,
    position: "absolute", // absolute
    // top: 0,
    // left: 0,
    zIndex: 2,
  },
  active: {
    borderColor: "red",
    zIndex: 1,
  },
  back: {
    borderStyle: "solid",
    // borderWidth: 2,
    borderRadius: 8,
    // borderColor: "rgba(0, 0, 0, 0.2)",
    backgroundColor: "rgba(0, 0, 0, 0.1)",
    position: "absolute", // absolute
    zIndex: 1,
    ...vars.flexCenter,
  },
  noContent: {
    borderStyle: "solid",
    borderWidth: 1,
    borderRadius: 8,
    borderColor: "rgba(0, 0, 0, 0.2)",
    // backgroundColor: "rgba(0, 0, 0, 0.4)",
    position: "absolute", // absolute
    zIndex: 1,
    ...vars.flexCenter,
  },
};

export default createStyles(styles);
